<template>
    <div id="add-edit-medical-record">
        <el-dialog
            :title="titleCon"
            v-model="isUseDialog" 
            draggable 
            :close-on-click-modal="false" 
            width="769px" 
            :before-close="handleClose"
            :destroy-on-close="true"
            @close="clean"
        >
            <el-form :model="ruleForm" ref="ruleFormRef" size="default" label-width="80px" :rules="rules">
                <el-row :gutter="35">

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('hKknEm2onUlakWpfBy7A')" prop="n_PhysicalEmp" :label-width="formLabelWidth">
                            <el-select 
                                v-model="ruleForm.n_PhysicalEmp" 
                                filterable 
                                class="m-2" 
                                :placeholder="$t('8DpGlcrrBmGlRtHfCt5Rh')" 
                                value-key="id"
                                @change="physicalChange"
                            >
                                <el-option
                                    v-for="item in physicalOption"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('hQmmlRmkje2IkDoxRZjj')" prop="v_WorkTypeName" :label-width="formLabelWidth">
                            <template v-if="showStatus">
                                <el-select
                                    v-model="ruleForm.v_WorkTypeName" 
                                    filterable 
                                    class="m-2" 
                                    :placeholder="$t('hQmmlRmkje2IkDoxRZjj')" 
                                    value-key="n_WorkType"
                                    @change="workTypeChange"
                                >
                                    <el-option
                                        v-for="item in workOption"
                                        :key="item.n_WorkType"
                                        :label="item.v_WorkTypeName"
                                        :value="item"
                                    />
                                </el-select>
                            </template>
                            <template v-else>
                                <el-input readonly disabled v-model="ruleForm.v_WorkTypeName" :placeholder="$t('hQmmlRmkje2IkDoxRZjj')" clearable />
                            </template>
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('rJvdhZdKsJWa5hSdaHIsD')" :label-width="formLabelWidth">
                            <el-input readonly disabled v-model="v_WorkTypeEmp" :placeholder="$t('p_9iJua0HfI3wi4KRz5x')" clearable />
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('znNlasayN2c2FbLjdQ3A')" :label-width="formLabelWidth">
                            <el-radio-group v-model="ruleForm.v_Sex" class="ml-4">
                                <el-radio label="1">{{ $t('4MYmOq2qZxYm69NuvVbL1') }}</el-radio>
                                <el-radio label="2">{{ $t('bN6HikCHjCZaOFabVk3hg') }}</el-radio>
                            </el-radio-group>
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('dCoohKB13LdkiwxYckHv')" :label-width="formLabelWidth" prop="v_WorkAddress">
                            <el-input v-model="ruleForm.v_WorkAddress" :placeholder="$t('p6r6tLnfMqqr13ZCfeofb')" clearable />
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('mpwJsFvaCugdYLjzkMzJw')" :label-width="formLabelWidth" prop="v_DiseaseHistory">
                            <el-input v-model="ruleForm.v_DiseaseHistory" :placeholder="$t('bcOdxjHp2lOxnHzCbJft9')" clearable />
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('93LtoXhXbJz_9ofgpcIl')" :label-width="formLabelWidth" prop="d_PhysicalTime">
                            <el-date-picker
                                v-model="ruleForm.d_PhysicalTime"
                                type="datetime"
                                value-format="YYYY-MM-DD HH:mm:ss"
                                popper-class="el-date-p"
                                :placeholder="$t('xYKtSx361Hm1x9r3giOx')"
                            >
                            </el-date-picker>
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('jrx4YMdK6xjeAhdbNiVgY')" :label-width="formLabelWidth" prop="v_PhysicalAddress">
                            <el-input v-model="ruleForm.v_PhysicalAddress" :placeholder="$t('rYsNm8uL1Bv0Y1V_6HmqS')" clearable />
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('lh37CfWmpMkwgcRxBtw2O')" :label-width="formLabelWidth" prop="v_PhysicalResult">
                            <el-input v-model="ruleForm.v_PhysicalResult" :placeholder="$t('lh37CfWmpMkwgcRxBtw2O')" clearable />
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('a26cYcmWc374dkCVamucz')" :label-width="formLabelWidth">
                            <div class="upload-d">
                                <el-upload
                                    ref="uploadFileTwo"
                                    action="#"
                                    multiple
                                    :show-file-list="false"
                                    :auto-upload='false'
                                    :on-change="cardChange"
                                    :before-upload="handleBeforeUpload"
                                    :on-remove="onRemove"
                                    style="width:100%"
                                >
                                    <el-button class="select-btn-s" v-if="showBtn"  type="primary" icon="ele-Plus" style="margin: 10px;">{{ $t('上 传') }}</el-button>
                                    <el-select
                                        v-if="isViewTwo"
                                        v-model="fileVal"
                                        multiple
                                        collapse-tags
                                        collapse-tags-tooltip
                                        :placeholder="$t('a26cYcmWc374dkCVamucz')"
                                        style="width: 240px"
                                        @change="fileChange"
                                        @focus="fileFocus"
                                    >
                                        <el-option
                                            v-for="item in fileOptions"
                                            :key="item.uid"
                                            :label="item.name"
                                            :value="item.uid"
                                        />
                                    </el-select>
                                    <el-input v-else readOnly slot="" :placeholder="$t('a26cYcmWc374dkCVamucz')" />
                                </el-upload>
                            </div>
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('sfwbsExMM3lGjDuN5zHf')" :label-width="formLabelWidth">
                            <el-switch
                                v-model="ruleForm.n_isValid"
                                active-color="#07AAF9"
                                inactive-color="#FF5F33"
                                inline-prompt
                                :active-text="$t('iPfonvtxVLm7knSyCsLBo')"
                                :inactive-text="$t('tzm8JwYsKnqKoNhheJlJx')"
                            />
                        </el-form-item>
                    </el-col>

                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item :label="$t('9RLaVEiJf1Z1Qv15o6Kll')" :label-width="formLabelWidth">
                            <el-input v-model="ruleForm.v_Remark" type="textarea" :placeholder="$t('9RLaVEiJf1Z1Qv15o6Kll')" clearable />
                        </el-form-item>
                    </el-col>

                </el-row>
            </el-form>

            <template v-if="titleCon === $t('b83sUyFRqWIhO1X1xxwhC')">
                <el-divider content-position="left"> {{ $t('a26cYcmWc374dkCVamucz') }} </el-divider>
                <el-table class="table-s" :data="fileListArr" style="width: 100%" border>
                    <el-table-column min-width="160" prop="name" :show-overflow-tooltip="true" :label="$t('dy_8xMBcxavTscHbkeW5o')"  align="center" />
                    <el-table-column min-width="270" prop="path" :show-overflow-tooltip="true" :label="$t('xe8OvJxoEjqnUsYgMbZ')"  align="center" />
                    <el-table-column min-width="120" prop="suffix" :show-overflow-tooltip="true" :label="$t('n5MmBr5wHt53aWdRWvGhj')"  align="center" />
                    <el-table-column min-width="120" prop="suffix" :show-overflow-tooltip="true" :label="$t('dScKg8pBv4cupCrxspq1r')"  align="center">
                        <template #default="scope">
                            <img style="width: 20px;height: 20px;" :src="pathData + scope.row.path" />
                        </template>
                    </el-table-column>
                    <el-table-column min-width="160" prop="createdTime" :show-overflow-tooltip="true" :label="$t('4pvjWhhdT5Nk2JMc5rQg')"  align="center" />
                    <el-table-column min-width="120" prop="createdUserName" :show-overflow-tooltip="true" :label="$t('8GbxAmDauKsBrgrQQa2')"  align="center" />
                    <el-table-column min-width="120" :show-overflow-tooltip="true" :label="$t('liBmO8wb58NMw5HLu9Nf')"  align="center"  fixed="right">
                        <template #default="scope">
                            <el-link target="_blank" :href="pathData + scope.row.path" type="primary"> {{ $t('i8A6uFe7Z4rYBFs9LUfm') }} </el-link>
                            <el-button @click="deleteHandle(scope.row.id)" class="icon-e" icon="ele-Delete" size="small" text type="danger"> {{ $t('mkwlMbm3qr88f0XxV9Pje') }} </el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </template>
            
            <template #footer>
                <el-button @click="cancelUseClick">{{ $t('yk_2HiWXbUkfQ7F6e3kXw') }}</el-button>
                <el-button type="primary" :loading="repeatDis" :disabled="repeatDis" @click="submitForm(ruleFormRef)">{{ $t('zdZCl09qrTjuPhYzWz7L') }}</el-button>
            </template>
        </el-dialog>
    </div>
</template>
<script lang="ts">
import { defineComponent, ref, Ref , reactive , computed , toRef , toRefs , toRaw , onMounted , watch } from 'vue'
import { ElMessageBox , FormInstance, FormRules , ElMessage, ElButton, ElCol, ElDatePicker, ElDialog, ElDivider, ElForm, ElFormItem, ElInput, ElOption, ElRadio, ElRow, ElSelect, ElTable, ElTableColumn } from 'element-plus'
import { 
    PhysicalRecordAdd , 
    PhysicalRecordUpdate , 
    EmpWorkTypeGetKeyWordList , 
    sysEmpSelector ,
    AttendanceRecordGenerateId ,
    sysFileInfoMultipleUpload ,
    sysFileInfoDelete ,
} from '/@/api/sms/sms'
import { type } from 'os'
import useCurrentInstance from '/@/utils/hook/useCurrentInstance';
/*** 定义接口基础数据类型 */
interface formType {
    v_WorkTypeEmp: String,
    repeatDis: Boolean,
    showStatus: Boolean,
    ruleForm: ruleFormType,
}
/*** form 表单数据类型 */
type ruleFormType = {
    n_Id?: Number, // 主键id
    n_WorkType: Number, // 工种Id
    v_WorkTypeName: String, // 工种名称

    // file: String, // 体检文件

    v_Sex: Number | String, // 性别 1男2女
    v_WorkAddress: String, // 工作单位
    v_DiseaseHistory: String, // 疾病史/家族史

    n_PhysicalEmp: Number | String, // 体检人

    d_PhysicalTime: String, // 体检时间
    v_PhysicalAddress: String, // 体检地址
    v_PhysicalResult: String, // 体检结果
    n_isValid: Boolean, // 是否启用 1启用/2禁用
    v_Remark: String, // 备注
}
export default defineComponent( {
    name: 'add-edit-medical-record',
    components: {},
    props: {
        isUseDialog:{
            type: Boolean,
            default: false,
        },
        repairInfo: {
            type: String,
            default: ''
        }
    },
    setup(props,ctx){
        const { proxy } = useCurrentInstance();
        const $t = proxy.$t;
        
        const titleCon = ref()
        const ruleFormRef = ref()
        const physicalOption = ref()
        const workOption: any = ref([])
        const fileListArr = ref([])
        const pathData = ref(import.meta.env.VITE_API_URL + '/') // 获取地址

        // 文件上传
        const insuranceVal = ref('')
        const isViewOne = ref(false)
        // const uploadFileOne:Ref = ref(null)
        // 文件上传

        // =============== 多文件上传基础数据定义 =====
		const fileVal:any = ref([]) // 上传身份证下拉框model值
        const fileOptions:any = ref([])
        const showBtn = ref(false)
        const isViewTwo = ref(false)
        const uploadFileTwo:Ref = ref(null)
        let snowflakeId:any = '' // 雪花id
		// =============== 多文件上传基础数据定义 =====

        /*** state 引用接口定义基础数据初始值 */
        const state = reactive < formType > ({
            repeatDis: false,
            v_WorkTypeEmp: '',
            showStatus: false,
            ruleForm: {} as ruleFormType
        })

        /*** 基础验证 rules */
        const rules = reactive < FormRules > ({
            /*** 放置验证 */
            // 体检人
            n_PhysicalEmp: [
				{ required: true, message: $t('d8WmX12KkMac8ANm4dAH'), trigger: 'change' },
			],
            // 工作单位
            v_WorkAddress: [
                { required: true, message: $t('mgSh5WcFhV2syDloTnbns'), trigger: 'blur' },
            ],
            // 疾病史/家族史
            v_DiseaseHistory: [
                { required: true, message: $t('1KXsNrTvNp6Jlju1ijyBf'), trigger: 'blur' },
            ],
            // 体检时间
            d_PhysicalTime: [
				{ required: true, message: $t('cy39RiPlIRgEr668ssArZ'), trigger: 'blur' },
			],
            // 体检地址
            v_PhysicalAddress: [
				{ required: true, message: $t('koGdwnzSi9hvKaOgJjeLm'), trigger: 'blur' },
			],
            // 体检结果
            v_PhysicalResult: [
				{ required: true, message: $t('fCWkoYtesMoTgPdSi2zXk'), trigger: 'blur' },
			],
            // 体检文件
            // file: [
			// 	{ required: true, message: $t('0e0dQpThCq40EmuP9mClB'), trigger: 'change' },
			// ],
        })

        /*** handleClose 关闭按钮点击事件 */
        const handleClose = () => {
            cancelUseClick()
        }

        /*** cancelUseClick 取消事件 */
        const cancelUseClick = () => {
            cleanFile()
            ctx.emit('cancelUseClick')
        }

        /*** physicalChange 体检人下拉选择事件 */
        const physicalChange = (val:any) => {
            console.log(val,'val')
            state.showStatus = false
            workOption.value = []
            state.ruleForm.v_WorkTypeName = ''
            state.v_WorkTypeEmp = ''
            getWorkFun(val)
        }

        /*** submitForm 提交事件 */
        const submitForm = (formEl: FormInstance | undefined) => {
            if(!formEl) return
            formEl.validate( async (valid) => { 
                if(valid){
                    let getData = toRaw(state.ruleForm)
                    let param:any = {}
                    getData.n_isValid ? param.n_isValid = 1 : param.n_isValid = 2
                    param.v_Sex = Number(getData.v_Sex)
                    const { n_isValid , v_WorkTypeName , ...getArr} = getData
                    let valObj = {...getArr,...param}

                    let fileArr:any = []
                    if(toRaw(fileOptions.value).length !== 0){
                        toRaw(fileOptions.value).map((i:any) => {
                            fileArr.push(i.raw)
                        })
                    }
                    if(fileArr.length !== 0){ await uploadFileFun(fileArr) }
                    if(props.repairInfo === ''){
                        state.repeatDis = true
                        valObj.n_FileId = snowflakeId
                        let res:any = await PhysicalRecordAdd(valObj)
                        if(res.success){ 
                            ctx.emit('updateData') 
                            ctx.emit('controlUseClick')
                            cleanFile()
                            state.repeatDis = false
                        }
                    }else{
                        state.repeatDis = true
                        let res:any = await PhysicalRecordUpdate(valObj)
                        if(res.success){ 
                            console.log('1234')
                            ctx.emit('updateData') 
                            ctx.emit('controlUseClick')
                            cleanFile()
                            state.repeatDis = false
                        }
                    }
                }else{
                    console.log('error submit!')
					return false
                }
            })
        }

        onMounted(() => {
            GetInfo()
        })
        /*** GetInfo 获取所有信息 */
        const GetInfo = async () => {
            // 人员下拉框
            let res:any = await sysEmpSelector()
            if(res.success){ physicalOption.value = res.data }
        }

        /*** workTypeChange 工种名称改变事件 */
        const workTypeChange = (val:any) => {
            state.ruleForm.n_WorkType = toRaw(val).n_WorkType
            state.ruleForm.v_WorkTypeName = toRaw(val).v_WorkTypeName
            state.v_WorkTypeEmp = toRaw(val).v_WorkTypeEmp
            
        }

        /***  获取体检人信息数据 */
        const getWorkFun = async(val:any) => {
            let res:any = await EmpWorkTypeGetKeyWordList({ N_EmpId: val })
            if(res.success && res.data.length !== 0){ 
                workOption.value = res.data[0].workTypeList
                state.showStatus = true
            }
        }

        /*** clean 清空数据 */
        const clean = () => {
            ruleFormRef.value.resetFields()
        }
        
        /*** cleanFile 清空文件数据 */
        const cleanFile = () => {
            if(uploadFileTwo.value){ 
                uploadFileTwo.value.clearFiles()
                fileOptions.value = []
                fileVal.value = []
            }
            // if(uploadFileOne.value){
            //     uploadFileOne.value.clearFiles()
            //     insuranceVal.value = ''
            //     isViewOne.value = false
            // }
        }

        /*** 监听isUseDialog的变化 */
        watch(() => props.isUseDialog,(newVal) => {
            if(newVal){
                // 状态数据重置
                state.repeatDis = false
                showBtn.value = false
                isViewOne.value = false
                isViewTwo.value = false
                fileListArr.value = []
                state.v_WorkTypeEmp = ''
                // 状态数据重置

                if(props.repairInfo !== ''){
                    titleCon.value = $t('b83sUyFRqWIhO1X1xxwhC')
                    let setPara:any = {}
                    let getData = JSON.parse(props.repairInfo)
                    getData.n_isValid === 1 ? setPara.n_isValid = true : setPara.n_isValid = false
                    snowflakeId = getData.n_FileId
                    if(JSON.parse(props.repairInfo).v_FilePath){
                        let filePath = JSON.parse(props.repairInfo).v_FilePath
                        let fileArr:any = []
                        filePath.map((i:any) => {
                            let fileData:any = {}
                            fileData.id = i.id
                            fileData.createdTime = i.createdTime
                            fileData.createdUserName = i.createdUserName
                            fileData.name = i.path.split('.')[0].split('/')[i.path.split('.')[0].split('/').length -1 ]
                            fileData.path = i.path
                            fileData.suffix = i.path.split('.')[i.path.split('.').length - 1]
                            fileArr.push(fileData)
                        })
                        fileListArr.value = fileArr
                    }
                    const {
                        n_isValid , 
                        tenantId , 
                        isDeleted , 
                        updatedTime , 
                        updatedUserId , 
                        updatedUserName ,
                        createdTime ,
                        createdUserId ,
                        createdUserName ,
                        ...setData} = getData
                    state.ruleForm = { ...setPara , ...setData }
                }else{
                    titleCon.value = $t('w4dyKdalGlmq6BkxOjP7Q')
                    state.ruleForm.n_WorkType = 0 // 工种Id
                    state.ruleForm.v_WorkTypeName = '' // 工种名称（用于显示）
                    
                    // state.ruleForm.file = '' // 体检文件

                    state.ruleForm.v_Sex = '1' // 性别 1男2女
                    state.ruleForm.v_WorkAddress = '' // 工作单位

                    state.ruleForm.n_PhysicalEmp = '' // 体检人

                    state.ruleForm.v_DiseaseHistory = '' // 疾病史/家族史

                    state.ruleForm.d_PhysicalTime = '' // 体检时间
                    state.ruleForm.v_PhysicalAddress = '' // 体检地址
                    state.ruleForm.v_PhysicalResult = '' // 体检结果
                    state.ruleForm.n_isValid = true // 是否启用 1启用/2禁用
                    state.ruleForm.v_Remark = '' // 备注
                    getNeedId()
                }
            }
        })

        /*** isUseDialog 响应弹窗的关闭  */
        const isUseDialog = computed(() => {
            return props.isUseDialog
        })

        /*** insuranceChange 团体险附件改变事件 */
        // const insuranceChange = (item:any) => {
        //     state.ruleForm.file = item.raw
        //     isViewOne.value = true
        //     insuranceVal.value = item.name
        //     console.log(item,'item数据')
        // }
        /*** cancelDepClickOne 团体险附件移除文件 */
        // const cancelDepClickOne = () => {
        //     ElMessage({
        //         message: $t('0UcNx90XGonNwmu6kFak'),
        //         type: 'success',
        //         duration: 1000,
        //         onClose: () => {
        //             uploadFileOne.value.clearFiles()
        //             insuranceVal.value = ''
        //             isViewOne.value = false
        //             state.ruleForm.file = ''
        //         }
        //     })
        // }

        // ================== 多文件上传事件 ==========

        const arrContrastFun = (arr1?:any , arr2?:any) => {
		    let newArr = []
		    if(arr1.length !== 0 && arr2.length !== 0){
		        for(let i = 0; i < arr1.length; i++){
		            for(let e = 0; e < arr2.length; e++){
		                if(arr1[i] === arr2[e].uid){
		                    newArr.push(arr2[e])
		                }
		            }
		        }
		    }
		    return newArr;
		}

        /*** fileChange select改变事件 */
        const fileChange:any = (val:any) => {
            uploadFileTwo.value.handleRemove((e:any) => { })
            if(val.length === 0){
                isViewTwo.value = false
                uploadFileTwo.value.clearFiles()
                fileVal.value = []
                fileOptions.value = []
            }
            if(val.length > 0){
                showBtn.value = true
            }else{
                showBtn.value = false
            }
            fileOptions.value = arrContrastFun(val , toRaw(fileOptions.value))
        }

        /*** cardChange 上传身份证改变事件 */
        const cardChange = (item:any) => {
            isViewTwo.value = true
            fileOptions.value.push(item)
            fileVal.value.push(item.uid)
            if(toRaw(fileOptions.value).length !== 0){
                showBtn.value = true
            }else{
                showBtn.value = false
            }
        }
        /*** uploadFileFun 文件上传函数 */
        const uploadFileFun = async(file:any) => {
            let param:any = {}
            param.files = file
            param.sourceType = 'SMS'
            param.sourceId = snowflakeId
            let res:any = await sysFileInfoMultipleUpload(param)
            if(res.success) return
        }

        /*** fileFocus select获取焦点的时候触发 */
        const fileFocus = () => {
            fileOptions.value = arrContrastFun(toRaw(fileVal.value) , toRaw(fileOptions.value))
        }

        const onRemove = (file:any,fileList:any) => {
		    let getFile = JSON.parse(JSON.stringify(fileList))
		    if(getFile.length === 0){
		        showBtn.value = false
		    }
		}

        /*** handleBeforeUpload 文件上传时的钩子函数 */
        const handleBeforeUpload = (file:any) => {
            console.log(fileOptions.value,'fileOptions')
        }

        /*** deleteHandle 删除数据事件 */
		const deleteHandle = async (val: String | Number) => {
		    ElMessageBox.confirm($t('jj0tHyWhJ4Frf44t43S4c'),$t('99FoyBoPtExRdppuYpkx'),
		        {
		            confirmButtonText: $t('cpmrq09Mw3tfVmwWGsZzb'),
		            cancelButtonText: $t('wFa44E4Iz025Ha2gYeDop'),
		            type: 'warning',
		        }
		    )
		    .then(async() => {
		        let param = {id : val}
		        try {
		            let res:any = await sysFileInfoDelete(param)
		            if(res.success){
		                let getArr = toRaw(fileListArr.value).filter((i:any) => {
		                    return i.id !== val
		                })
		                fileListArr.value = getArr
		                ctx.emit('updateData')
		            }
		        } catch (err) { return }
		    })
		    .catch(() => {
		        ElMessage({
		            type: 'info',
		            message: $t('ummczgwDCP3jaIVczZic'),
		        })
		    })
		}
        
        /*** getNeedId 获取雪花id */
        const getNeedId = async () => {
            let res:any = await AttendanceRecordGenerateId()
            if(res.success) snowflakeId = res.data
        }

        // ================== 多文件上传事件 ==========

        return {
            handleClose,
            submitForm,
            cancelUseClick,
            clean,
            ruleFormRef,
            titleCon,
            ...toRefs(state),
            isUseDialog,
            rules,
            physicalChange,
            physicalOption,

            // 文件上传
            insuranceVal,
            isViewOne,
            // cancelDepClickOne,
            // insuranceChange,
            // uploadFileOne,
            // 文件上传

            formLabelWidth: '120px',
            workOption,
            workTypeChange,

            // ==========多文件上传====
            cardChange,
            onRemove,
            showBtn,
            isViewTwo,
            fileVal,
            fileChange,
            fileFocus,
            fileOptions,
            uploadFileTwo,
            handleBeforeUpload,
            // ==========多文件上传====
            fileListArr,
            deleteHandle,
            pathData,

        }
    },
} )
</script>
<style scoped lang="scss">
    :deep(.el-select){
        width: 100%;
    }
    :deep(.el-input){
        width: 100%;
    }
    :deep(.el-upload){
        width: 100%;
    }
    :deep(.el-link){
        font-size: 12px;
    }
    // :deep(.el-divider__text){
    //     color: #303133;
    //     font-weight: bold;
    // }
    .table-s{
        :deep(.el-icon){
            margin-right: 0px!important;
            margin-left: 12px!important;
        }
    }
    // 文件上传样式
    .upload-d{
        position: relative;
        width: 100%;
        :deep(.el-upload){
            width: 100%;
            // position: absolute;
            // top: 0;
            // left: 0;
        }
        .select-btn-s{
            position: absolute;
            top: 2px;
            right: 1px;
            z-index: 3;
            margin: 0!important;
            border: none!important;
            background: rgba(255,255,255,1)!important;
            color: #0052D9!important;
            height: 28px;
        }
        .select-btn-s:active{
            color: #0052D9!important;
        }
        .select-btn-s:hover{
            color: #0052D9!important;
        }
        .upload-b{
            display: flex;
            align-items: center;
            position: absolute;
            top: 8px;
            right: 10px;
            line-height: initial;
            background: unset !important;
            :deep(a){
                background: unset !important;
                margin-right: 10px;
            }
            :deep(span){
                background: unset !important;
            }
        }
    }
</style>